<template>
        <!-- 复核管理详情 -->
        <a-form-model ref="ruleForm"  :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
            <a-spin :spinning="loading" style="min-height: 400px;background-color: #fff">
                <!-- 表格 -->
                <Empty v-if="!dataList.length"></Empty>
                <template v-else>
                <a-card :bordered="false" v-for="item in dataList" :key="item.id">
                    <title-name title="复核信息"></title-name>
                    <custom-form :isEmit="false" :formList="item.formList" :form="item" :editModel="''"> </custom-form>
                    <title-name title="复核结果"></title-name>
                        <section v-for="ele in item.technicalReviewManagementReslutList" :key="ele.id">
                            <custom-form :isEmit="false" :formList="formListThree" :form="ele" :editModel="''"> </custom-form>
                            <hr class="hr" />
                        </section>
                </a-card>
                </template>
            </a-spin>
        </a-form-model>
</template>

<script>
  import BaseEditPage from '@/views/baseEditPage' // 编辑详情页基础配置
  import API from '@/api/office/hazardIdentification'
  import { queryByConstructionProgramId } from '@/api/technical/technicalReview'
  import { getReviewCheckProjectAll, getReviewContentAll } from '@/api/technical/reviewContent'
  import SelectPersonByProject from '@/components/Select/SelectPersonByProject' // 分公司
  import { Empty } from 'ant-design-vue'

  export default {
    name: 'a' + Date.now(),
    extends: new BaseEditPage(),
    components: {
      Empty
    },
    data() {
      return {
        // 加载控件
        loading: false,
        // 按钮加载
        loadingBtn: false,
        // 页面类型
        pageType: '',
        // 登录人信息
        userInfo: JSON.parse(sessionStorage.getItem('ycloud-user_info')),
        // 表单
        form: { fileInfoList: [], checkAreaId: undefined, checkContentId: undefined, practicalParticipantName: [] },
        // form: { viewName: '', fileInfoList: [] }, // 表单
        editModel: 0, // 操作状态:0 查看;1 编辑;2 新增
        id: '',
        schemArr: [], //方案名称
        checkProjectArr: [], //项目名称
        checkContentArr: [], //复核内容数组
        checkAreatArr: [], //复核区域数组
        checkPositionArr: [], //复核部位数组
        projectIdData: '',
        reviewTypeData: {}, //计划内数据
        rules: {},
        dataList: [{technicalReviewManagementReslutList: [],formList: []}],
        newFormList: []
      }
    },
    computed: {
      formList() {
        let newFormList = [
          // /api/cscec-project-business/projects/employees/list
          {
            keyName: 'reviewType',
            type: 'a-select',
            label: '复核类型',
            disabled: this.pageType !== 'add',
            data: [
              {
                label: '计划内',
                value: 0
              },
              {
                label: '计划外',
                value: 1
              }
            ]
          },
          {
            keyName: 'constructionProgramName',
            type: 'BaseInput',
            disabled: this.pageType !== 'add',
            label: '方案名称'
          },
          {
            keyName: 'checkProjectId',
            type: 'a-select',
            disabled: this.pageType !== 'add',
            label: '复核项目',
            data: this.checkProjectArr,
          },
          {
            keyName: 'checkContentId',
            type: 'a-select',
            disabled: this.pageType !== 'add' || this.form.reviewType !== 1,
            label: '复核内容',
            data: this.checkContentArr
          },
          {
            keyName: 'checkAreaId',
            type: 'a-tree-Select',
            disabled: this.pageType !== 'add' || this.form.reviewType !== 1,
            label: '复核区域',
            multiple: true,
            data: this.checkAreatArr
          },
          {
            keyName: 'checkParts',
            type: 'BaseInput',
            disabled: this.pageType !== 'add' || this.form.reviewType !== 1,
            label: '复核部位',
            span: 8
          },
          { keyName: 'organizerName', hidden: this.form.reviewType == 1, type: 'BaseInput', label: '组织人', disabled: true, span: 8 },
          { keyName: 'chargePersonName', hidden: this.form.reviewType == 1, type: 'BaseInput', label: '责任人', disabled: true, span: 8 },
          { keyName: 'plannedCompletionTime', hidden: this.form.reviewType == 1, type: 'BaseInput', label: '计划完成时间', disabled: true, span: 8 }
        ]
        // if (this.typeReview * 1 === 1) {
        //   newFormList.splice(4)
        // } else if (this.typeReview * 1 === 2) {
        //   newFormList.splice(3)
        // }
        return newFormList
      },
      formListTwo() {
        let newFormListTwo = [
          // { keyName: 'checkParts', type: 'BaseInput', label: '复核部位', disabled: true, span: 8 },
          // { keyName: 'reviewConclusionName', type: 'BaseInput', label: '复核结论', disabled: true, span: 8 },
          {
            keyName: 'reviewConclusion',
            disabled: this.pageType === 'look',
            type: 'a-select',
            label: '复核结论',
            data: [
              {
                label: '通过',
                value: 0
              },
              {
                label: '不通过',
                value: 1
              }
            ]
          },
          {
            keyName: 'practicalOrganizerId',
            viewName: 'practicalOrganizerName',
            type: SelectPersonByProject,
            disabled: this.pageType === 'look',
            label: '实际组织人',
            attrs: {
              addJob: false,
              id: this.form.branchCompanyId,
              projectId: this.form.projectId,
              showSearch: true,
              isProject: true
            },
            personChanged: (e) => {
              this.form.practicalOrganizerName = e.employeeName;
            }
          },
          {
            keyName: 'practicalParticipantId',
            viewName: 'practicalParticipantName',
            disabled: this.pageType === 'look',
            type: SelectPersonByProject,
            label: '参与复核人',
            attrs: {
              addJob: false,
              id: this.form.branchCompanyId,
              projectId: this.form.projectId,
              showSearch: true,
              isProject: true,
              mode: 'multiple',
              maxTagCount: 100
            },
            personChanged: (e) => {
              this.form.practicalParticipantName = []
              if (Array.isArray(e)) {
                e.forEach((item) => {
                  this.form.practicalParticipantName.push(item.employeeName);
                })
              }
            }
          },
          {
            keyName: 'practicalChargePersonId',
            viewName: 'practicalChargePersonName',
            disabled: this.pageType === 'look',
            type: SelectPersonByProject,
            label: '实际责任人',
            attrs: {
              addPhone: false,
              id: this.form.branchCompanyId,
              projectId: this.form.projectId,
              showSearch: true,
              isProject: true
            },
            personChanged: (e) => {
              this.form.practicalChargePersonName = e.employeeName;
            }
          },
          {
            keyName: 'reviewCompletionTime',
            type: 'a-date-picker',
            disabled: this.pageType === 'look',
            placeholder: '请选择日期',
            label: '复核完成时间',
            attrs: {
              valueFormat: 'YYYY-MM-DD'
            }
          },
          {
            label: '填报时间',
            keyName: 'fillTime',
            type: 'BaseInput',
            disabled: true
          },
          {
            label: '填报人',
            keyName: 'informantName',
            type: 'BaseInput',
            disabled: true
          },
          {
            keyName: 'reviewRecord',
            type: 'BaseTextarea',
            label: '复核记录',
            attrs: {
              maxLength : 1000,
            },
            span: 22
          },
          {
            keyName: 'fileInfoList',
            disabled: this.pageType === 'look',
            hidden: false,
            label: '图片上传',
            businessCode: 'QM01',
            span: 24,
            attrs: {
              uploadType: 'image',
              editModel: this.pageType === 'look' ? '0' : '1'
            },
            type: 'uploadFile'
          }
        ]
        return newFormListTwo
      },
      formListThree(){
        return [
          {
            label: '复核结论',
            keyName: 'reviewConclusionName',
            type: 'BaseInput',
            disabled: true
          },
          {
            label: '实际组织人',
            keyName: 'practicalOrganizerName',
            type: 'BaseInput',
            disabled: true
          },
          {
            label: '参与复核人',
            keyName: 'practicalParticipantName',
            type: 'BaseInput',
            disabled: true
          },
          {
            label: '实际责任人',
            keyName: 'practicalChargePersonName',
            type: 'BaseInput',
            disabled: true
          },
          {
            label: '复核完成时间',
            keyName: 'reviewCompletionTime',
            type: 'BaseInput',
            disabled: true
          },
          {
            label: '填报时间',
            keyName: 'fillTime',
            type: 'BaseInput',
            disabled: true
          },
          {
            label: '填报人',
            keyName: 'informantName',
            type: 'BaseInput',
            disabled: true
          },
          {
            keyName: 'reviewRecord',
            type: 'BaseTextarea',
            label: '复核记录',
            disabled: true,
            attrs: {
              maxLength : 1000,
            },
            span: 22
          },
          {
            keyName: 'fileInfoList',
            disabled: true,
            hidden: false,
            label: '图片上传',
            businessCode: 'QM01',
            span: 24,
            attrs: {
              uploadType: 'image',
              editModel: '0'
            },
            type: 'uploadFile'
          }
        ]
      }
    },
    created() {
      this.pageType = this.$route.query.pageType
    },
    mounted() {
      this.getReviewContent()
      this.getDetails()

    },
    methods: {
      /**
       * @description: 获取复合区域
       * @param {projectId 项目id}
       * @return {res.data}
       */
      async getCheckArea() {
        if (!this.dataList[0].projectId) return
        let res = await API.subPackArea({}, { id: this.dataList[0].projectId, sources: 0 })
        if (res.code === this.SUCCESS_CODE) {
          if (!res.data[0].children) {
            this.checkAreatArr = []
            return false
          }
          this.checkAreatArr = this.filterLeaderTree(res.data)
          this.$forceUpdate()
        }
      },
      /**
       * @description: 过滤复合区域
       * @param {projectId 项目id}
       * @return {res.data}
       */
      filterLeaderTree(treeData) {
        return treeData.map((item) => {
          if (item.children && item.children.length) {
            return {
              ...item,
              disabled: true,
              children: this.filterLeaderTree(item.children)
            }
          } else {
            return {
              ...item
            }
          }
        })
      },
      /**
       * @description: 根据项目改变带出信息
       * @param {projectId 项目id}
       * @return {res.data}
       */
      async checkProjectChange(e) {
        let checkProjectData = {}
        this.checkProjectArr.forEach((item) => {
          if (item.id === e) {
            checkProjectData = item
          }
        })
        let contentParams = { checkId: checkProjectData.checkProjectId, status: true }
        if (this.form.reviewType === 1) {
          contentParams.checkId = checkProjectData.id
        }else {
          this.form.reviewContentId = checkProjectData.id
        }
        /***************************************获取复合内容  **********************************/

        let res = await getReviewContentAll(contentParams)
        if (res.data) {
          this.checkContentArr = res.data.map((item) => {
            item.label = item.content
            item.value = item.id
            return item
          })
        }
        /***************************************获取复合内容  **********************************/
      },
      /**
       * @description: 获取复核项目
       * @param status  状态
       * @return {res.data}
       */
      async getReviewContent() {
        let params = { status: true }
        let res = await getReviewCheckProjectAll(params)
        if (res.data?.length > 0) {
          this.checkProjectArr = res.data.map((item) => {
            item.label = item.name
            item.value = item.id
            return item
          })
        }
      },

      /**
       * @description: 获取详情
       * @param
       * @return {}
       */
      getDetails() {
        this.loading = true
        let that = this
        const data = {
          id: this.$route.query.reAuditId
        }
        queryByConstructionProgramId(data)
          .then(async (res) => {
            if (res.data) {
              this.loading = false
              const versionNum = this.$route.query.versionNumber
              this.dataList = res.data.filter(item => item.constructionProgramVersion == versionNum)
              await this.getCheckArea()
              await  this.checkProjectChange(this.dataList[0].checkProjectId)
              this.dataList.forEach(item=>{
                let newFormList = [
                  // /api/cscec-project-business/projects/employees/list
                  {
                    keyName: 'reviewType',
                    type: 'a-select',
                    label: '复核类型',
                    disabled: this.pageType !== 'add',
                    data: [
                      {
                        label: '计划内',
                        value: 0
                      },
                      {
                        label: '计划外',
                        value: 1
                      }
                    ]
                  },
                  {
                    keyName: 'constructionProgramName',
                    type: 'BaseInput',
                    disabled: this.pageType !== 'add',
                    label: '方案名称'
                  },
                  {
                    keyName: 'checkProjectId',
                    type: 'a-select',
                    disabled: this.pageType !== 'add',
                    label: '复核项目',
                    data: this.checkProjectArr,
                  },
                  {
                    keyName: 'checkContentId',
                    type: 'a-select',
                    disabled: this.pageType !== 'add' || this.form.reviewType !== 1,
                    label: '复核内容',
                    data: that.checkContentArr
                  },
                  {
                    keyName: 'checkAreaId',
                    type: 'a-tree-Select',
                    disabled: this.pageType !== 'add' || this.form.reviewType !== 1,
                    label: '复核区域',
                    multiple: true,
                    data: that.checkAreatArr
                  },
                  {
                    keyName: 'checkParts',
                    type: 'BaseInput',
                    disabled: this.pageType !== 'add' || this.form.reviewType !== 1,
                    label: '复核部位',
                    span: 8
                  },
                  { keyName: 'organizerName', hidden: item.reviewType == 1, type: 'BaseInput', label: '组织人', disabled: true, span: 8 },
                  { keyName: 'chargePersonName', hidden: item.reviewType == 1, type: 'BaseInput', label: '责任人', disabled: true, span: 8 },
                  { keyName: 'plannedCompletionTime', hidden: item.reviewType == 1, type: 'BaseInput', label: '计划完成时间', disabled: true, span: 8 }
                ]
                if (item.checkAreaId) {
                  item.checkAreaId = item.checkAreaId.split(',') || ''
                }
                item.formList = newFormList
              })

             this.$forceUpdate()
            }
            console.log( this.dataList, ' this.dataList')
          })
          .catch(() => {
            this.loading = false
          })
      }
    }
  }
</script>
<style lang="less" scoped>
    /deep/ .form-item  {
        .ant-input:not([disabled]),
        .ant-select:not(.ant-select-disabled) .ant-select-selection,
        .ant-calendar-picker-input,
        .ant-input-number:not([disabled]),
        .ant-cascader-picker {
            border-color: #e4ac0b;
            background-color: #fff9e8;
        }
        .ant-input-disabled,
        .ant-input-number-disabled .ant-input-number-input,
        .ant-time-picker-input[disabled] {
            border-color: #d9d9d9 !important;
            background-color: #f5f5f5 !important;
        }
    }
    .fileInfoList-tip {
        position: absolute;
        z-index: 1000;
        left: -109px;
        top: -3px;
        color: red;
    }
    .hr {
        background: #f5f5f5;
        height: 10px;
        border: none;
    }
</style>
